<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8" meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<title>例子</title>
	<link rel="stylesheet" href="/index/WaterFlow/Public/css/bootstrap.min.css">
	<link rel="stylesheet" href="/index/WaterFlow/Public/css/style.css">
	<script src="/index/WaterFlow/Public/js/jquery.js"></script>
	<script src="/index/WaterFlow/Public/js/bootstrap.min.js"></script>
</head>
<body style="background-color: #E6E6E6">
	<div class="container-fluid">
		<div class="navbar navbar-default navbar-fixed-top" role="navigation">
			<div class="title-left">
				登录
			</div>
			<div class="title-name"><?php echo ($user_rec["username"]); ?></div>
		</div>
		<div class="row ">
			<div class="col-xs-6 col-md-6" id="body-left">
				
			</div>
			<div class="col-xs-6 col-md-6" id="body-right">
				
			</div>
		</div>
	</div>
	<script src="/index/WaterFlow/Public/js/js.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$.ajax({
				type: "post",
				url: "/index/WaterFlow/index.php/Home/Index/show",
				contentType: "application/x-www-form-urlencoded; charset=utf-8",
				success: function(data) {
					for(var i = 0; i < 2; i++) {
						$.aa(data[i]);
						$.aa(data[i]);
						$.aa(data[i]);
					}
				}
			});
		});

			(function($) {
				
				$("div#like").each(function() {
					$(this).click(function() {
						if($(this).attr("class") == "state-ico state-ico-active") {
							$(this).removeClass("state-ico-active");
						} else {
							$(this).addClass("state-ico-active");
						}
					});
				});

				$(window).bind("scroll", function() {
					var aa = $(window).height() + $(document).scrollTop() - $(document).height();
					if(aa > -10) {
						$.ajax({
							type: "post",
							url: "/index/WaterFlow/index.php/Home/Index/show",
							contentType: "application/x-www-form-urlencoded; charset=utf-8",
							success: function(data) {
								for(var i = 0; i < 2; i++) {
									$.bb(data[i]);
								}
							}
						});
					}
				});

			})(jQuery);

			$.extend({
				'aa': function(data) {
					var id = data.id;
					var img = data.image;
					var favour = data.favour;
					var aa = $("#body-left").height();
					var bb = $("#body-right").height();
					var left = '<div class="body-left"><div class="top-image"><a href="/index/WaterFlow/index.php/Home/Detail/index?id='+id+'"><img src="/index/WaterFlow/Public/' + img + '" alt=""></a></div><div class="bottom-state"><div class="bottom-l"><img src="/index/WaterFlow/Public/' + img + '" alt=""></div><div class="bottom-r"><div class="state-ico" id="like"></div><div class="count">' + favour + '</div></div></div></div>';
					var right = '<div class="body-right"><div class="top-image"><a href="/index/WaterFlow/index.php/Home/Detail/index?id='+id+'"><img src="/index/WaterFlow/Public/' + img + '" alt=""></a></div><div class="bottom-state"><div class="bottom-l"><img src="/index/WaterFlow/Public/' + img + '" alt=""></div><div class="bottom-r"><div class="state-ico" id="like"></div><div class="count">' + favour + '</div></div></div></div>';
					if(aa > bb) {
						$("#body-right").append(right);
					} else {
						$("#body-left").append(left);
					}
				},
				'bb': function(data) {
					var img = data.image;
					var favour = data.favour;
					var aa = $("#body-left").height();
					var bb = $("#body-right").height();
					var left = '<div class="body-left"><div class="top-image"><a href="#"><img src="/index/WaterFlow/Public/' + img + '" alt=""></a></div><div class="bottom-state"><div class="bottom-l"><img src="/index/WaterFlow/Public/' + img + '" alt=""></div><div class="bottom-r"><div class="state-ico" id="like"></div><div class="count">' + favour + '</div></div></div></div>';
					var right = '<div class="body-right"><div class="top-image"><a href="#"><img src="/index/WaterFlow/Public/' + img + '" alt=""></a></div><div class="bottom-state"><div class="bottom-l"><img src="/index/WaterFlow/Public/' + img + '" alt=""></div><div class="bottom-r"><div class="state-ico" id="like"></div><div class="count">' + favour + '</div></div></div></div>';
					if(aa > bb) {
						$("#body-right").children().last().after(right);
					} else {
						$("#body-left").children().last().after(left);
					}
				}
			});




	</script>
</body>
</html>